<template>
	<view class="gradient-background">
    <Navbar title="单词测试" bgColor="transparent" :hideBtn="true" :h5Show="false"></Navbar>
    <view class="mobile-item-container" style="background-color: transparent;">
      <view style="font-size: 40rpx; font-weight: bold; padding: 0 0 40rpx 0;">阶段测试</view>
      <u-grid col="3">
        <u-grid-item @click="navigateTo('/pages/work/word_test/enToCh')">
          <view style="position: relative;">
            <u-icon name="chat" color="#2979ff" size="60rpx"></u-icon>
          </view>
          <text class="btn-text">看英选中</text>
        </u-grid-item>
        <u-grid-item @click="navigateTo('/pages/work/word_test/listen')">
          <view style="position: relative;">
            <u-icon name="list-dot" color="#2979ff" size="60rpx"></u-icon>
          </view>
          <text class="btn-text">听音辨义</text>
        </u-grid-item>
        <u-grid-item @click="navigateTo('/pages/work/word_test/spell')">
          <view style="position: relative;">
            <u-icon name="warning" color="#2979ff" size="60rpx"></u-icon>
          </view>
          <text class="btn-text">拼写测试</text>
        </u-grid-item>
      </u-grid>
    </view>
    </view>
</template>

<script>
import Navbar from '@/components/navbar/Navbar'
import Gap from '@/components/gap/Gap'

export default {
  components: {
    Gap,
    Navbar,
  },
  data () {
    return {
      activeKey: 'work',
      tabs: [{
        name: '日常工作',
        key: 'work'
      }, {
        name: '插件',
        key: 'plugin'
      }],
      todo: {
        notice: 2,
        task: 5,
        error: 1
      }
    }
  },
  methods: {
    tabChange (item) {
      this.activeKey = item.key;
    },
    navigateTo (url) {
      uni.navigateTo({ url: url })
    }
  }
}
</script>

<style lang="scss">
</style>